<template>
  <div>
    <el-form ref="ruleFormRefa" :model="formInlines" label-width="120px" :rules="formRules" label-position="top"
      class="demo-ruleForm">
      <el-row :gutter="30">
        <el-col :value="24" :xs="24" :sm="24">
          <el-form-item label="确认结果" prop="confirm">
            <el-radio-group v-model="formInlines.confirm" @change="changeconfirm">
              <el-radio :value="1" size="large">真实</el-radio>
              <el-radio :value="2" size="large">误报</el-radio>
              <el-radio :value="3" size="large">测试</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <div v-if="formInlines.confirm == 1" class="w-[100%]">
          <el-col :value="24" :xs="24" :sm="24">
            <el-form-item label="处理结果" prop="dealStatus">
              <el-radio-group v-model="formInlines.dealStatus">
                <el-radio :value="1">无需处理</el-radio>
                <el-radio :value="2">工单处理</el-radio>
                <el-radio :value="3">已处理</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :value="24" :xs="24" :sm="24" v-if="formInlines.dealStatus == 2">
            <el-form-item label="派发方式" prop="sellMethod">
              <el-radio-group v-model="formInlines.sellMethod">
                <el-radio v-for="item in WORKORDER_DISPATCH_TYPE" :key="item.value" :value="item.value">
                  {{ isNullOrEmpty(item.label) }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>

          <el-col :value="12" :xs="12" :sm="12" v-if="formInlines.sellMethod === 1 && formInlines.dealStatus == 2">
            <el-form-item label="工单流程" prop="processId">
              <processesselect v-model="formInlines.processId" :project-id="projectId" clearable placeholder="请选择工单流程"
                :style="{ width: '100%' }" @blur="formValidateField(ruleFormRefa, 'processId')">
              </processesselect>
            </el-form-item>
          </el-col>

          <el-col :value="12" :xs="12" :sm="12" v-if="formInlines.sellMethod === 2 && formInlines.dealStatus == 2">
            <el-form-item label="处理人" prop="handleUid">
              <authorizeuserproject v-model="formInlines.handleUid" clearable :isid="1" :projectId="projectId"
                placeholder="请选择" :style="{ width: '100%' }" @blur="formValidateField(ruleFormRefa, 'handleUid')" />
            </el-form-item>
          </el-col>

          <el-col :value="12" :xs="12" :sm="12" v-if="formInlines.sellMethod == 2 && formInlines.dealStatus == 2">
            <el-form-item label="通知方式" prop="noticeType">
              <el-checkbox-group v-model="formInlines.noticeType">
                <el-checkbox v-for="item in WORKORDER_NOTICE_TYPE" :key="item.value" :value="item.value">
                  {{ isNullOrEmpty(item.label) }}
                </el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </el-col>

          <el-col :value="24" :xs="24" :sm="24">
            <el-form-item label="处理意见" prop="dealView">
              <el-input v-model="formInlines.dealView" :autosize="{ minRows: 4 }" type="textarea" clearable
                placeholder="请输入处理意见" />
            </el-form-item>

          </el-col>
        </div>
      </el-row>
    </el-form>
  </div>
</template>

<script setup lang="ts">
import { isNullOrEmpty } from '@/utils/functions'
import { ref } from "vue";
import type { FormRules } from "element-plus";
import authorizeuserproject from "@/components/select/authorizeuser/authorizeuserScreen.vue";
import { WORKORDER_DISPATCH_TYPE, WORKORDER_NOTICE_TYPE } from "@/constant/workorder-mangenment";
import processesselect from "@/components/select/processesselect/processesSelectScreen.vue";
import { formValidateField } from '@/utils/functions'
type FormProps = {
  id: number;
  formInlines: Object;
  projectId: number;
};
const props = withDefaults(defineProps<FormProps>(), {
  id: {
    type: Number,
    default: 0
  },
  projectId: {
    type: Number,
    default: 0
  },
  formInlines: {
    confirm: null,
    projectId: null,
    dealStatus: null,
    dealView: null,
    sellMethod: null,
    processId: null,
    handleUid: null,
    noticeType: []
  }
});
onMounted(() => {
  console.log(props.projectId, "ids");
});
const changeconfirm=(e)=>{
  if(e!==1){
    props.formInlines.dealStatus=1
  }
}
// const formInline = ref({
//   id: props.id,
//   confirm: null,
//   dealStatus: null,
//   dealView: null
// });
const ruleFormRefa = ref();
const formRules = reactive(<FormRules>{
  dealView: [{ required: true, message: "请输入处理意见", trigger: "blur" }],
  dealStatus: [{ required: true, message: "请选择处理结果", trigger: "blur" }],
  confirm: [{ required: true, message: "请选择确认结果", trigger: "blur" }]
});
function getRef() {
  return ruleFormRefa.value;
}
defineExpose({ getRef });
</script>
